// ==UserScript==
// @name         万宝楼助手
// @namespace    https://gitee.com/archi_chen/assistant-of-wanbao-building
// @version      0.1
// @description  万宝楼助手。
// @updateURL    https://gitee.com/archi_chen/assistant-of-wanbao-building/raw/master/%E4%B8%87%E5%AE%9D%E6%A5%BC%E5%8A%A9%E6%89%8B.user.js
// @downloadURL  https://gitee.com/archi_chen/assistant-of-wanbao-building/raw/master/%E4%B8%87%E5%AE%9D%E6%A5%BC%E5%8A%A9%E6%89%8B.user.js
// @homepageURL  https://gitee.com/archi_chen/assistant-of-wanbao-building
// @supportURL   https://gitee.com/archi_chen/assistant-of-wanbao-building/issues
// @author       Ar
// @license      MIT
// @compatible   chrome 80 or later
// @compatible   firefox 77 or later
// @compatible   opera 69 or later
// @match        https://jx3.seasunwbl.com/buyer?t=role
// @grant        none
// @run-at       document-end
// @require      https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js
// ==/UserScript==

(function() {
    'use strict';
    $("head").append(`<script crossorigin="anonymous" integrity="sha384-et+fqdf7kslHL5Ip8rXSJPUPODLa7eMfpFTBaCfnlMzrcAz/wxI5Xm/mNTZwd+7H" src="https://lib.baomitu.com/echarts/4.7.0/echarts.min.js"></script>`);

    const req_id = sessionStorage.getItem("req_id");
    const goods_type = 2;
    const additional_key = "role_equipment_info";

    let latestConsignmentId = 0;

    let refresh = true;
    $("body").bind('DOMSubtreeModified', function(){
        if (!refresh) return;
        refresh = false;
        const activeItems = $(".ant-modal-body div[class^='app-web-components-tabs-index-m__tabItem--'][class*='m__active']");
        if (true) {
            const consignmentRegResult = $(".ant-modal-content").text().match(/商品编号：(\d*)/);
            if (consignmentRegResult && consignmentRegResult[1]) {
                const consignment_id = consignmentRegResult[1];
                if (latestConsignmentId !== consignment_id) {
                    latestConsignmentId = consignment_id;
                    fetch(`//api-wanbaolou.xoyo.com/api/buyer/goods/additional_data?req_id=${req_id}&consignment_id=${consignment_id}&goods_type=2&additional_key=role_equipment_info`)
                    .then(rep => rep.json())
                    .then(data => {
                      if(data.msg === 'SUCCESS') {
                          let statistics = data.data.additional_data.equip.map((suitData, index) => {
                              let no = index + 1;
                              let pvpSum = suitData.Equips.filter(item=> item.ModifyType&& item.ModifyType.filter(type => type.Desc === 'atDecriticalDamagePowerBase').length >=1).length;
                              let pveSum = suitData.Equips.length - pvpSum;
                              return {
                                  no,
                                  pvpSum,
                                  pveSum
                              };
                          });
                          $("div[id^='main']").remove();
                          statistics = statistics.sort((a, b) => b.no - a.no);
                          statistics.forEach((chartData, index) => {
                              if (chartData.pvpSum === 0 && chartData.pveSum === 0) return;
                              let judgment = "半PVP半PVE";
                              if (chartData.pvpSum === 0) judgment = "纯PVE";
                              if (chartData.pveSum === 0) judgment = "纯PVP";
                              if (chartData.pvpSum >= 8 && chartData.pveSum !== 0 && (chartData.pvpSum + chartData.pveSum) >= 12) judgment = "偏PVP";
                              if (chartData.pveSum >= 8 && chartData.pvpSum !== 0 && (chartData.pvpSum + chartData.pveSum) >= 12) judgment = "偏PVE";
                              if ((chartData.pvpSum + chartData.pveSum) < 12) judgment = "装备不全";
                               $(".ant-modal-body").after(`
    <div id="main${index}" style="width: 300px;height:200px; display: inline-block"></div>
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main${index}'));
        // 指定图表的配置项和数据
        var option = {
            title: {
                text: '第${chartData.no}套装备（${judgment}）'
            },
            color: ['#FF515A', '#03a9f4'],
            tooltip: {},
              legend: {
    type: 'scroll',
    orient: 'vertical',
    left: '70%',
    align: 'left',
    top: 'middle',
    itemWidth: 14,
    itemHeight: 14,
    icon: 'circle',
    textStyle: {
      color: '#333',
      fontSize: 12,
    },
  },  grid: {
    bottom: 0,
    top: 0,
  },
series: [
    {
      name: '',
      type: 'pie',
      center: ['35%', '50%'],
      radius: ['35%', '60%'],
      clockwise: false, //饼图的扇区是否是顺时针排布
      avoidLabelOverlap: false,
      itemStyle: {
        //图形样式
        normal: {
          borderColor: '#ffffff',
          borderWidth: 10,
        },
      },
      label: {
        normal: {
          show: false,
          position: 'outter',
          formatter: function(parms) {
            return parms.percent + '%';
          },
        },
      },
      labelLine: {
        normal: {
          length: 15,
          length2: 20,
        },
      },
      data: [{value: ${chartData.pvpSum}, name: 'PVP装备'},
                {value: ${chartData.pveSum}, name: 'PVE装备'}],
    },
  ]
        };
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    </script>
`);

                          });
                      }
                    })
                }
            }
        }
        refresh = true;
    })
    // Your code here...
})();
